import { Image, StyleSheet, Platform ,TouchableOpacity,ScrollView} from 'react-native'

import { ThemedText } from '@/components/ThemedText'
import { ThemedView } from '@/components/ThemedView'
import { useRouter } from 'expo-router'
import useResponsive from '@/rem/rem'
 
 
import { useEffect, useState } from 'react'
import axios from 'axios'
export default function Showads() {
  const { w, h, fs } = useResponsive() 
  const router = useRouter()
  const [list,setlist]=useState([]) 

  const getaddress = async () => {
    try{
       const {data:{data}}  = await axios.get('http://127.0.0.1.18:3000/addresslist')
         setlist(data)
    }catch(err){
      console.log(err)
    }
  }
  useEffect(() => {
       getaddress()     
  },[])

  const styles = StyleSheet.create({
    big: {
      backgroundColor: 'reansparent'
    },
    container: {
      width:w(375),
    
      alignItems: 'center',
      justifyContent: 'space-between',
      flexDirection: 'row',
      borderRadius: 5,
      marginBottom: 10,
      backgroundColor: 'rgb(254, 246, 225)',
    },
    username: {
      fontSize: 16,
      fontWeight: 'bold',
      color: '#333',
      marginRight: 5,
    },
    phoneNumber: {
      fontSize: 16,
      fontWeight: 'bold',
      color: '#333',

    },
    address: {
      fontSize: 14,
      color: '#666',

    },
    editButton: {

      padding: 5,
      backgroundColor: '#f0f0f0',
      borderRadius: 5,
    },
    buttonText: {
      fontSize: 14,
      color: '#333',
    },
    jiben: {
      flexDirection: 'row',
      backgroundColor: 'transparent',

    },
    petCardButtonbox:{
      width:w(375),
      height:h(80),
      flex:1,
      justifyContent: 'center', // 垂直居中
    alignItems: 'center', // 水平居中
    backgroundColor:'transparent',
    marginTop: 30,
    marginBottom:30,
    },
    petCardButton: {
      
      width: w(200),
  
      backgroundColor: 'rgb(255, 122, 3)',
      textAlign: 'center',
    
    
      borderRadius: 30,
     
     
    padding: 10, // 可选：添加内边距以确保文本不会紧贴边缘
    },
    moren: {
      backgroundColor: 'rgb(254, 131, 71)',
      color: 'white',
      borderRadius: 5,
      marginLeft: 6
    }


  })

  return (
  <ScrollView  >
    <ThemedView style={styles.big}>
       
      {
        list.map(item=>{
          return <ThemedView style={styles.container  } key={item._id}>
      <ThemedView style={{padding:15 ,backgroundColor: 'transparent',}}>
        <ThemedView style={styles.jiben}><ThemedText style={styles.username}>{item.name}</ThemedText>
        <ThemedText style={styles.phoneNumber}>{item.phone}</ThemedText>
        {
          item.status == 1 && (<ThemedText style={styles.moren}>默认</ThemedText>)
        }
        {
          item.status == 0 && (<ThemedText > </ThemedText>)
        }
       {/*  <ThemedText style={styles.moren}>默认</ThemedText> */}
        
        </ThemedView>
        
        <ThemedText style={styles.address}> {item.province}{item.city}{item.district}{item.detailedAddress}</ThemedText>
      </ThemedView>
      <TouchableOpacity style={styles.editButton,{padding:15}} onPress={() => console.log('Edit')}>
        <ThemedText style={styles.buttonText}>编辑</ThemedText>
      </TouchableOpacity>
      </ThemedView>
        })
      }
      <ThemedView style={styles.petCardButtonbox}>
        <ThemedView style={styles.petCardButton}>
          <ThemedText style={{color:'white',textAlign:'center'}} onPress={() => router.push('/address/add')}>新建地址</ThemedText>
       </ThemedView>
      </ThemedView>
      
      
    </ThemedView>
     </ScrollView>
  )
}

